//自调用函数
(function () {
    // 1、页面一加载就要知道页面宽度计算
    var setFont = function () {
        // 因为要定义变量可能和别的变量相互冲突，污染，所有用自调用函数
        var html = document.documentElement;// 获取html
        // 获取宽度
        var width = html.clientWidth;

        // 判断
        if (width < 1024) width = 1024
        if (width > 1920) width = 1920
        // 设置html的基准值
        var fontSize = width / 80 + 'px';
        // 设置给html
        html.style.fontSize = fontSize;
    }
    setFont();
    // 2、页面改变的时候也需要设置
    // 尺寸改变事件
    window.onresize = function () {
        setFont();
    }
})();

(function () {
    //事件委托
    $('.monitor').on('click', ' a', function () {
        //点击当前的a 加类名 active  他的兄弟删除类名
        $(this).addClass('active').siblings().removeClass('active');
        //获取一一对应的下标 
        var index = $(this).index();
        //选取content 然后狗日对应下标的 显示   当前的兄弟.content隐藏
        $('.content').eq(index).show().siblings('.content').hide();
    });
    //滚动
    //原理：把marquee下面的子盒子都复制一遍 加入到marquee中
    //      然后动画向上滚动，滚动到一半重新开始滚动
    //因为选取的是两个marquee  所以要遍历
    $('.monitor .marquee').each(function (index, dom) {
        //将每个 的所有子级都复制一遍
        var rows = $(dom).children().clone();
        //再将新的到的加入原来的
        $(dom).append(rows);
    });
	    //定时器
    var index = 0;
    var aclick = $('.monitor a');
    setInterval(function () {
        index++;
        if (index > 3) {
            index = 0;
        }
        //每san秒调用点击事件
        aclick.eq(index).click();
    }, 3000);
})();
//echarts 饼状图
(function () {

    var myechart = echarts.init($('.pie')[0]);
    option = {
        // 控制提示
        tooltip: {
            // 非轴图形，使用item的意思是放到数据对应图形上触发提示
            trigger: 'item',
            // 格式化提示内容：
            // a 代表图表名称 b 代表数据名称 c 代表数据  d代表  当前数据/总数据的比例
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        // 控制图表
        series: [
            {
                // 图表名称
                name: '地区',
                // 图表类型
                type: 'pie',
                // 南丁格尔玫瑰图 有两个圆  内圆半径10%  外圆半径70%
                // 百分比基于  图表DOM容器的半径
                radius: '75%',
                // 图表中心位置 left 50%  top 50% 距离图表DOM容器
                center: ['50%', '50%'],
                // 半径模式，另外一种是 area 面积模式
                //roseType: 'area',
                // 数据集 value 数据的值 name 数据的名称
                data: [
                    { value: 1351, name: '广东' },
                    { value: 1272, name: '河南' },
                    { value: 1215, name: '浙江' },
                    { value: 1018, name: '湖南' },
                    { value: 67466, name: '湖北' },
                    { value: 6323, name: '其他地区' },
                    { value: 990, name: '安徽' },
                    { value: 935, name: '江西' }
                ],
                //文字调整
                label: {
                    fontSize: 12,
					color: 'white'
                },
                //引导线
                labelLine: {
                    length: 6,
                    length2: 10
                }
            }
        ],
        color: ['#006cff', '#60cda0', '#ed8884', '#ff9f7f', '#0096ff', '#9fe6b8', '#32c5e9', '#1d9dff']
    };
    myechart.setOption(option);
})();

// 中间下端-用户
(function () {
    // 中间省略的数据  准备三项
    var item = {
        name: '',
        value: 1200,
        // 柱子颜色
        itemStyle: {
            color: '#254065'
        },
        // 鼠标经过柱子颜色
        emphasis: {
            itemStyle: {
                color: '#254065'
            }
        },
        // 工具提示隐藏
        tooltip: {
            extraCssText: 'opacity:0'
        }
    };
        
	var china_json={"2020-01-20": {"\u7d2f\u8ba1\u786e\u8bca": "291", "\u7d2f\u8ba1\u7591\u4f3c": "54", "\u7d2f\u8ba1\u6cbb\u6108": "25", "\u7d2f\u8ba1\u6b7b\u4ea1": "6"}, "2020-01-21": {"\u7d2f\u8ba1\u786e\u8bca": "440", "\u7d2f\u8ba1\u7591\u4f3c": "37", "\u7d2f\u8ba1\u6cbb\u6108": "25", "\u7d2f\u8ba1\u6b7b\u4ea1": "9"}, "2020-01-22": {"\u7d2f\u8ba1\u786e\u8bca": "571", "\u7d2f\u8ba1\u7591\u4f3c": "393", "\u7d2f\u8ba1\u6cbb\u6108": "25", "\u7d2f\u8ba1\u6b7b\u4ea1": "17"}, "2020-01-23": {"\u7d2f\u8ba1\u786e\u8bca": "830", "\u7d2f\u8ba1\u7591\u4f3c": "1072", "\u7d2f\u8ba1\u6cbb\u6108": "34", "\u7d2f\u8ba1\u6b7b\u4ea1": "25"}, "2020-01-24": {"\u7d2f\u8ba1\u786e\u8bca": "1287", "\u7d2f\u8ba1\u7591\u4f3c": "1965", "\u7d2f\u8ba1\u6cbb\u6108": "38", "\u7d2f\u8ba1\u6b7b\u4ea1": "41"}, "2020-01-25": {"\u7d2f\u8ba1\u786e\u8bca": "1975", "\u7d2f\u8ba1\u7591\u4f3c": "2684", "\u7d2f\u8ba1\u6cbb\u6108": "49", "\u7d2f\u8ba1\u6b7b\u4ea1": "56"}, "2020-01-26": {"\u7d2f\u8ba1\u786e\u8bca": "2744", "\u7d2f\u8ba1\u7591\u4f3c": "5794", "\u7d2f\u8ba1\u6cbb\u6108": "51", "\u7d2f\u8ba1\u6b7b\u4ea1": "80"}, "2020-01-27": {"\u7d2f\u8ba1\u786e\u8bca": "4515", "\u7d2f\u8ba1\u7591\u4f3c": "6973", "\u7d2f\u8ba1\u6cbb\u6108": "60", "\u7d2f\u8ba1\u6b7b\u4ea1": "106"}, "2020-01-28": {"\u7d2f\u8ba1\u786e\u8bca": "5974", "\u7d2f\u8ba1\u7591\u4f3c": "9239", "\u7d2f\u8ba1\u6cbb\u6108": "103", "\u7d2f\u8ba1\u6b7b\u4ea1": "132"}, "2020-01-29": {"\u7d2f\u8ba1\u786e\u8bca": "7711", "\u7d2f\u8ba1\u7591\u4f3c": "12167", "\u7d2f\u8ba1\u6cbb\u6108": "124", "\u7d2f\u8ba1\u6b7b\u4ea1": "170"}, "2020-01-30": {"\u7d2f\u8ba1\u786e\u8bca": "9692", "\u7d2f\u8ba1\u7591\u4f3c": "15238", "\u7d2f\u8ba1\u6cbb\u6108": "171", "\u7d2f\u8ba1\u6b7b\u4ea1": "213"}, "2020-01-31": {"\u7d2f\u8ba1\u786e\u8bca": "11791", "\u7d2f\u8ba1\u7591\u4f3c": "17988", "\u7d2f\u8ba1\u6cbb\u6108": "243", "\u7d2f\u8ba1\u6b7b\u4ea1": "259"}, "2020-02-01": {"\u7d2f\u8ba1\u786e\u8bca": "14380", "\u7d2f\u8ba1\u7591\u4f3c": "19544", "\u7d2f\u8ba1\u6cbb\u6108": "328", "\u7d2f\u8ba1\u6b7b\u4ea1": "304"}, "2020-02-02": {"\u7d2f\u8ba1\u786e\u8bca": "17205", "\u7d2f\u8ba1\u7591\u4f3c": "21558", "\u7d2f\u8ba1\u6cbb\u6108": "475", "\u7d2f\u8ba1\u6b7b\u4ea1": "361"}, "2020-02-03": {"\u7d2f\u8ba1\u786e\u8bca": "20438", "\u7d2f\u8ba1\u7591\u4f3c": "23214", "\u7d2f\u8ba1\u6cbb\u6108": "632", "\u7d2f\u8ba1\u6b7b\u4ea1": "425"}, "2020-02-04": {"\u7d2f\u8ba1\u786e\u8bca": "24324", "\u7d2f\u8ba1\u7591\u4f3c": "23260", "\u7d2f\u8ba1\u6cbb\u6108": "892", "\u7d2f\u8ba1\u6b7b\u4ea1": "490"}, "2020-02-05": {"\u7d2f\u8ba1\u786e\u8bca": "28018", "\u7d2f\u8ba1\u7591\u4f3c": "24702", "\u7d2f\u8ba1\u6cbb\u6108": "1153", "\u7d2f\u8ba1\u6b7b\u4ea1": "563"}, "2020-02-06": {"\u7d2f\u8ba1\u786e\u8bca": "31161", "\u7d2f\u8ba1\u7591\u4f3c": "26359", "\u7d2f\u8ba1\u6cbb\u6108": "1540", "\u7d2f\u8ba1\u6b7b\u4ea1": "636"}, "2020-02-07": {"\u7d2f\u8ba1\u786e\u8bca": "34594", "\u7d2f\u8ba1\u7591\u4f3c": "27657", "\u7d2f\u8ba1\u6cbb\u6108": "2052", "\u7d2f\u8ba1\u6b7b\u4ea1": "723"}, "2020-02-08": {"\u7d2f\u8ba1\u786e\u8bca": "37162", "\u7d2f\u8ba1\u7591\u4f3c": "28942", "\u7d2f\u8ba1\u6cbb\u6108": "2651", "\u7d2f\u8ba1\u6b7b\u4ea1": "812"}, "2020-02-09": {"\u7d2f\u8ba1\u786e\u8bca": "40224", "\u7d2f\u8ba1\u7591\u4f3c": "23589", "\u7d2f\u8ba1\u6cbb\u6108": "3283", "\u7d2f\u8ba1\u6b7b\u4ea1": "909"}, "2020-02-10": {"\u7d2f\u8ba1\u786e\u8bca": "42708", "\u7d2f\u8ba1\u7591\u4f3c": "21675", "\u7d2f\u8ba1\u6cbb\u6108": "3998", "\u7d2f\u8ba1\u6b7b\u4ea1": "1017"}, "2020-02-11": {"\u7d2f\u8ba1\u786e\u8bca": "44730", "\u7d2f\u8ba1\u7591\u4f3c": "16067", "\u7d2f\u8ba1\u6cbb\u6108": "4742", "\u7d2f\u8ba1\u6b7b\u4ea1": "1114"}, "2020-02-12": {"\u7d2f\u8ba1\u786e\u8bca": "58839", "\u7d2f\u8ba1\u7591\u4f3c": "13435", "\u7d2f\u8ba1\u6cbb\u6108": "5646", "\u7d2f\u8ba1\u6b7b\u4ea1": "1260"}, "2020-02-13": {"\u7d2f\u8ba1\u786e\u8bca": "63932", "\u7d2f\u8ba1\u7591\u4f3c": "10109", "\u7d2f\u8ba1\u6cbb\u6108": "6728", "\u7d2f\u8ba1\u6b7b\u4ea1": "1381"}, "2020-02-14": {"\u7d2f\u8ba1\u786e\u8bca": "66575", "\u7d2f\u8ba1\u7591\u4f3c": "8969", "\u7d2f\u8ba1\u6cbb\u6108": "8101", "\u7d2f\u8ba1\u6b7b\u4ea1": "1524"}, "2020-02-15": {"\u7d2f\u8ba1\u786e\u8bca": "68584", "\u7d2f\u8ba1\u7591\u4f3c": "8229", "\u7d2f\u8ba1\u6cbb\u6108": "9425", "\u7d2f\u8ba1\u6b7b\u4ea1": "1666"}, "2020-02-16": {"\u7d2f\u8ba1\u786e\u8bca": "70637", "\u7d2f\u8ba1\u7591\u4f3c": "7264", "\u7d2f\u8ba1\u6cbb\u6108": "10860", "\u7d2f\u8ba1\u6b7b\u4ea1": "1772"}, "2020-02-17": {"\u7d2f\u8ba1\u786e\u8bca": "72528", "\u7d2f\u8ba1\u7591\u4f3c": "6242", "\u7d2f\u8ba1\u6cbb\u6108": "12561", "\u7d2f\u8ba1\u6b7b\u4ea1": "1870"}, "2020-02-18": {"\u7d2f\u8ba1\u786e\u8bca": "74276", "\u7d2f\u8ba1\u7591\u4f3c": "5248", "\u7d2f\u8ba1\u6cbb\u6108": "14387", "\u7d2f\u8ba1\u6b7b\u4ea1": "2006"}, "2020-02-19": {"\u7d2f\u8ba1\u786e\u8bca": "75101", "\u7d2f\u8ba1\u7591\u4f3c": "4922", "\u7d2f\u8ba1\u6cbb\u6108": "16168", "\u7d2f\u8ba1\u6b7b\u4ea1": "2121"}, "2020-02-20": {"\u7d2f\u8ba1\u786e\u8bca": "75993", "\u7d2f\u8ba1\u7591\u4f3c": "5206", "\u7d2f\u8ba1\u6cbb\u6108": "18277", "\u7d2f\u8ba1\u6b7b\u4ea1": "2239"}, "2020-02-21": {"\u7d2f\u8ba1\u786e\u8bca": "76392", "\u7d2f\u8ba1\u7591\u4f3c": "5365", "\u7d2f\u8ba1\u6cbb\u6108": "20672", "\u7d2f\u8ba1\u6b7b\u4ea1": "2348"}, "2020-02-22": {"\u7d2f\u8ba1\u786e\u8bca": "76846", "\u7d2f\u8ba1\u7591\u4f3c": "4148", "\u7d2f\u8ba1\u6cbb\u6108": "22907", "\u7d2f\u8ba1\u6b7b\u4ea1": "2445"}, "2020-02-23": {"\u7d2f\u8ba1\u786e\u8bca": "77262", "\u7d2f\u8ba1\u7591\u4f3c": "3434", "\u7d2f\u8ba1\u6cbb\u6108": "24757", "\u7d2f\u8ba1\u6b7b\u4ea1": "2595"}, "2020-02-24": {"\u7d2f\u8ba1\u786e\u8bca": "77779", "\u7d2f\u8ba1\u7591\u4f3c": "2824", "\u7d2f\u8ba1\u6cbb\u6108": "27353", "\u7d2f\u8ba1\u6b7b\u4ea1": "2666"}, "2020-02-25": {"\u7d2f\u8ba1\u786e\u8bca": "78190", "\u7d2f\u8ba1\u7591\u4f3c": "2491", "\u7d2f\u8ba1\u6cbb\u6108": "29775", "\u7d2f\u8ba1\u6b7b\u4ea1": "2718"}, "2020-02-26": {"\u7d2f\u8ba1\u786e\u8bca": "78630", "\u7d2f\u8ba1\u7591\u4f3c": "2358", "\u7d2f\u8ba1\u6cbb\u6108": "32531", "\u7d2f\u8ba1\u6b7b\u4ea1": "2747"}, "2020-02-27": {"\u7d2f\u8ba1\u786e\u8bca": "78959", "\u7d2f\u8ba1\u7591\u4f3c": "2308", "\u7d2f\u8ba1\u6cbb\u6108": "36157", "\u7d2f\u8ba1\u6b7b\u4ea1": "2791"}, "2020-02-28": {"\u7d2f\u8ba1\u786e\u8bca": "79389", "\u7d2f\u8ba1\u7591\u4f3c": "1418", "\u7d2f\u8ba1\u6cbb\u6108": "39049", "\u7d2f\u8ba1\u6b7b\u4ea1": "2838"}, "2020-02-29": {"\u7d2f\u8ba1\u786e\u8bca": "79968", "\u7d2f\u8ba1\u7591\u4f3c": "851", "\u7d2f\u8ba1\u6cbb\u6108": "41675", "\u7d2f\u8ba1\u6b7b\u4ea1": "2873"}, "2020-03-01": {"\u7d2f\u8ba1\u786e\u8bca": "80174", "\u7d2f\u8ba1\u7591\u4f3c": "715", "\u7d2f\u8ba1\u6cbb\u6108": "44518", "\u7d2f\u8ba1\u6b7b\u4ea1": "2915"}, "2020-03-02": {"\u7d2f\u8ba1\u786e\u8bca": "80302", "\u7d2f\u8ba1\u7591\u4f3c": "587", "\u7d2f\u8ba1\u6cbb\u6108": "47260", "\u7d2f\u8ba1\u6b7b\u4ea1": "2946"}, "2020-03-03": {"\u7d2f\u8ba1\u786e\u8bca": "80303", "\u7d2f\u8ba1\u7591\u4f3c": "587", "\u7d2f\u8ba1\u6cbb\u6108": "47398", "\u7d2f\u8ba1\u6b7b\u4ea1": "2947"}}
			
			
			var date_conv = [];
			for(var i in china_json){
				date_conv.push(i)
			}
			
			confirm_china=[];
			dead_china=[];
			cure_china=[];
			suspect_china=[];
			for(var i in china_json){
				var dead = parseInt(china_json[i]["累计死亡"]);
				var cure = parseInt(china_json[i]["累计治愈"]);
				var sus = parseInt(china_json[i]["累计疑似"]);
				var is = parseInt(china_json[i]["累计确诊"]);
				confirm_china.push(is-dead-cure);
				dead_china.push(dead);
				cure_china.push(cure);
				suspect_china.push(sus);
			}
			
			var option ={
			    tooltip: {
			        trigger: 'axis',
			        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
			            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
			        }
			    },
			    legend: {
					textStyle:{
						color:'white'
					},
			        data: ['现有确诊', '死亡', '治愈', '疑似']
			    },
			    grid: {
			        left: '3%',
			        right: '4%',
			        bottom: '3%',
			        containLabel: true
			    },
			    xAxis: {
					axisLine:{
						show:false
					},
					axisLabel:{
						fontSize : 12,
						fontWeight :'lighter',
						formatter: function (value, index) {
						    // 格式化成月/日，只在第一个刻度显示年份
						    var date = new Date(value);
						    var texts = [(date.getMonth() + 1), date.getDate()];
						    if (index === 0) {
						        texts.unshift(date.getYear());
						    }
						    return texts.join('/');
						},
						textStyle:{
							color:'white'
						}
					},
					type: 'category',
					data: date_conv
			    },
			    yAxis: {
					axisLine:{
						show:false
					},
					axisLabel:{
						fontSize : 12,
						fontWeight : 'lighter',
						textStyle:{
							color:'white'
						}
					},
					splitLine:{
						show:false
					},
			        type: 'value'
			    },
			    series: [
			        {
			            name: '现有确诊',
			            type: 'bar',
			            stack: '总量',
			            data: confirm_china
			        },
			        {
			            name: '死亡',
			            type: 'bar',
			            stack: '总量',
						color: '#00ff00',
			            data: dead_china
			        },
			        {
			            name: '治愈',
			            type: 'bar',
			            stack: '总量',
						color: '#ff8f00',						
			            data: cure_china
			        },
			        {
			            name: '疑似',
			            type: 'bar',
			            stack: '总量',
						color: '#00ccff',						
			            data: suspect_china
			        }
			    ]
			};
	
	var myechart = echarts.init($('.users .bar')[0]);
    myechart.setOption(option);
})();

//右上角新增病例
(function () {
    var data = {
        day365: { confirmed: '143', cured: '2,195', death: '31'},
        day90: { confirmed: '391', cured: '7,591', death: '100'},
        day30: { confirmed: '1,935', cured: '19,578', death: '268'},
        day1: { confirmed: '80,570', cured: '52,381', death: '3,016'},
    }
    //点击事件
    $('.order').on('click', '.filter a', function () {
        //点击之后加类名
        $(this).addClass('active').siblings().removeClass('active');
        // 先获取点击a的 data-key自定义属性
        var key = $(this).attr('data-key');
        //获取自定义属性
        // data{}==>data.shuxing data['shuxing]
        key = data[key];//
        $('.order .item h4:eq(0)').text(key.confirmed);
        $('.order .item h4:eq(1)').text(key.cured);
		$('.order .item h4:eq(2)').text(key.death);
    });
    //定时器
    var index = 0;
    var aclick = $('.order a');
    setInterval(function () {
        index++;
        if (index > 3) {
            index = 0;
        }
        //每san秒调用点击事件
        aclick.eq(index).click();
    }, 2500);
})();
//销售
(function () {
    var option = {
        //鼠标提示工具
        tooltip: {
            trigger: 'axis'
        },
        xAxis: {
            // 类目类型                                  
            type: 'category',
            // x轴刻度文字                                  
            data: ['2.27', '2.28', '2.29', '3.01', '3.02', '3.03', '3.04'],
            axisTick: {
                show: false//去除刻度线
            },
            axisLabel: {
                color: '#4c9bfd'//文本颜色
            },
            axisLine: {
                show: false//去除轴线  
            },
            boundaryGap: false//去除轴内间距
        },
        yAxis: {
            // 数据作为刻度文字                                  
            type: 'value',
            axisTick: {
                show: false//去除刻度线
            },
            axisLabel: {
                color: '#4c9bfd'//文本颜色
            },
            axisLine: {
                show: false//去除轴线  
            },
            boundaryGap: false//去除轴内间距
        },
        //图例组件
        legend: {
            textStyle: {
                color: '#white' // 图例文字颜色
            },
            right: '10%'//距离右边10%
        },
        // 设置网格样式
        grid: {
            show: true,// 显示边框
            top: '20%',
            left: '3%',
            right: '4%',
            bottom: '3%',
            borderColor: '#012f4a',// 边框颜色
            containLabel: true // 包含刻度文字在内
        },
        series: [{
            name: '湖北',
            // 数据                                  
            data: [318, 423, 570, 196, 114, 115, 134],
            // 图表类型                                  
            type: 'line',
            // 圆滑连接                                  
            smooth: true,
            itemStyle: {
                color: '#00f2f1'  // 线颜色
            }
        },
        {
            name: '全国',
            // 数据                                  
            data: [329, 430, 579, 206, 128, 120, 143],
            // 图表类型                                  
            type: 'line',
            // 圆滑连接                                  
            smooth: true,
            itemStyle: {
                color: '#ed3f35'  // 线颜色
            }
        }]
    };
    var myechart = echarts.init($('.line')[0]);
    myechart.setOption(option);

    //点击效果
    var data = {
		//确诊
        year: [
            [318, 423, 570, 196, 114, 115, 134],
            [329, 430, 579, 206, 128, 120, 143]
        ],
		//疑似
        quarter: [
			[332, 159, 64, 80, 64, 52, 67],
            [452, 248, 132, 141, 129, 143, 143]
            
        ],
		//治愈
        month: [
            [3203, 2492, 2292, 2570, 2410, 2389, 1923],
            [3626, 2892, 2626, 2843, 2742, 2654, 2195]
        ],
		//死亡
        week: [
            [41, 45, 34, 42, 31, 37, 31],
            [44, 47, 35, 42, 31, 38, 31]
        ]
    }
    $('.sales ').on('click', '.caption a', function () {
        $(this).addClass('active').siblings('a').removeClass('active');
        //option series   data
        //获取自定义属性值
        var key = $(this).attr('data-type');
        //取出对应的值
        key = data[key];
        //将值设置到 图表中
        option.series[0].data = key[0];
        option.series[1].data = key[1];
        //再次调用才能在页面显示
        myechart.setOption(option);
    });
    //定时器
    var index = 0;
    var timer = setInterval(function () {
        index++;
        if (index > 4) {
            index = 0;
        };
        $('.sales .caption a').eq(index).click();
    }, 2000);
})();
(function () {
    var option = {
        series: [
            {
                type: 'pie',
                radius: ['130%', '150%'],  // 放大图形
                center: ['50%', '80%'],    // 往下移动  套住75%文字
                label: {
                    show: false,
                },
                startAngle: 180,
                hoverOffset: 0,  // 鼠标经过不变大
                data: [
                    {
                        value: 100,
                        itemStyle: { // 颜色渐变#00c9e0->#005fc1
                            color: {
                                type: 'linear',
                                x: 0,
                                y: 0,
                                x2: 0,
                                y2: 1,
                                colorStops: [
                                    { offset: 0, color: '#00c9e0' },
                                    { offset: 1, color: '#005fc1' }
                                ]
                            }
                        }
                    },
                    { value: 100, itemStyle: { color: '#12274d' } }, // 颜色#12274d

                    { value: 200, itemStyle: { color: 'transparent' } }// 透明隐藏第三块区域
                ]
            }
        ]
    };
    //var myechart = echarts.init($('.gauge')[0]);
    //myechart.setOption(option);
})();
(function () {
    var data = [
        { name: '可爱多', num: '9,086' },
        { name: '娃哈哈', num: '8,341' },
        { name: '喜之郎', num: '7,407' },
        { name: '八喜', num: '6,080' },
        { name: '小洋人', num: '6,724' },
        { name: '好多鱼', num: '2,170' },
    ]
    $('.inner').on('mouseenter', '.sup li', function () {
        $(this).addClass('active').siblings().removeClass('active');
        //获取随机的值  sort方法 是给数组排序 a-b是从小到大
        //.5-随机0-1的数 可能为正可能为负 排序就会随机
        var radomData = data.sort(function (a, b) { return 0.5 - Math.random() });
        var html = '';
        radomData.forEach(function (item) {
            html += `<li><span>${item.name}</span><span>${item.num} <s class="icon-up"></s></span></li>`;
        });
        //渲染
        $('.sub').html(html);
    });
    $('.province .sup li').eq(0).mouseenter();
    var index = 0;
    var timer = setInterval(() => {
        index++;
        if (index > 5) {
            index = 0;
        }
        $('.sup li').eq(index).mouseenter();
    }, 2000);
})();